<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <style>
        body {
            height: 2000px;
        }

        button {
            width: 30px;
            height: 20px;
        }
    </style>
</head>

<body>
    <button id="btn">点我</button>
</body>
<script>
    window.onload = function () {
        window.addEventListener('scroll',dbounce2(function () {
            console.log(1)
        },1000) )
        let btn = document.getElementById('btn');
        btn.onclick = dbounce2(function () {
            console.log('点我了！')
        }, 1000, true)


        function dbounce(fn, wait) {
            // 初始化一个变量用来记录定时器的id
            let timer = 0;
            // 返回一个真正调用的防抖函数
            return function (...arg) {
                // 如果timer已经被赋值了定时器id，那么就清除他，随之定时器内部的函数也不会执行
                if (timer) {
                    clearTimeout(timer)
                }
                // 直到最后一次才执行定时器内部的函数达到防抖的功能
                timer = setTimeout(function (arg) {
                    fn.apply(this, arg)
                }, wait)
            }
        }
        /**
        *  添加immediate 立即执行选项
        */
        function dbounce(fn, wait, immediate) {
              // 初始化一个变量timer用来记录定时器的id
            //   初始化一个变量lastTime用来上次执行的时间
            let timer = null, lastTime = 0;
              // 返回一个真正调用的防抖函数
            return function (...arg) {
                if (!timer) {
                    timer = setTimeout(function () {
                        if (!immediate) {
                            fn.apply(this, arg)
                        }
                    }, wait)
                    // 如果立即执行
                    if (immediate) {
                        fn.apply(this, arg)
                    }
                } else {
                    clearTimeout(timer)
                      // 直到最后一次才执行定时器内部的函数达到防抖的功能
                    timer = setTimeout(function () {
                        // 下次执行必定要大于间隔时间
                        if (new Date().getTime() - lastTime > wait) {
                            lastTime = new Date().getTime()
                            fn.apply(this, arg)
                        }
                    }, wait)
                }

            }
        }
    }
</script>

</html>